<template>
	<div>
		<div class="first" style="margin-top: 20px;">



			<div style="width: 100px;"><label style="line-height: 36px;">订单类型</label></div>

				<el-select v-model="select1" slot="prepend" placeholder="请选择">
				<el-option label="服务商模式下的订单" value="1"></el-option>
				<el-option label="本商户的订单" value="2"></el-option>

				</el-select>

				<el-select v-model="select2" slot="prepend" placeholder="请选择">
				<el-option label="微信收款商业版" value="1"></el-option>

				</el-select>

		</div>

		<div class="second" style="margin-top: 20px;">


				<div style="width: 110px; "><label style="line-height: 36px;">交易时间</label></div>
				<el-date-picker
					v-model="date1"
					type="date"
					placeholder="选择日期">
				</el-date-picker>

				<span class="demonstration" style="line-height: 36px;">&nbsp;&nbsp;到&nbsp;&nbsp;</span>

				<el-date-picker
					v-model="date2"
					type="date"
					placeholder="选择日期">
				</el-date-picker>
        <br>

				</div>
        <div class="text1">
          单次查询日期的最长跨度为31天
        </div>

        <el-button type="success">查询</el-button><a href="">显示高级选项</a>


	</div>
</template>

<script>
	export default{
		name:'QueryByOrder',
		data(){
			return{
				select1:'1',
				select2:'1',
				date1:'',
				date2:''

			}
		}
	}
</script>

<style scoped>
	.block1{
		display: flex;
	}
	.el-date-picker{
		margin-top: 20px;

	}
	.el-select{
		margin-left: 10px;
	}
	.first{
		display: flex;
	}
	.second{
		display: flex;
	}
  .text1{
    padding-left: 110px;
    padding-top: 10px;
    padding-bottom: 20px;
    color: #959699;
    font-size: 14px;
  }
  .el-button{
    background-color: #00c250;
    width: 102px;
    height: 40px;
    margin-left: 110px;
    margin-right: 20px;
  }


</style>
